<!DOCTYPE html>
<html lang="zh-Hans">
<head>
    <meta charset="UTF-8">
    <meta name="author" content="zhaolin">
    <meta name="description" content="learn front_end test">

    <title>my first page!</title>
    <link rel="shortcut icon" href="/static/images/logo.png" type="image/x-icon">
    <link href="/static/css/test.css" rel="stylesheet">
</head>
<body>
<h1>这是网站标题</h1>

<p>
    啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas啊实打实大所多sadas
</p>
<ul>
    <li>网页</li>
    <li>知道</li>
    <li>图片</li>
</ul>
<p>元素选择器</p>
<p id="anid">ID选择器</p>
<p class="anclass">类选择器</p>
<img src="/static/images/background.jpg" alt="my pic">属性选择器

<figure>
    <img src="/static/images/bing.png" alt="my pic">
    <figcaption>bingicon</figcaption>
</figure>
<br>
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d5560.739285768359!2d108.76613603805583!3d34.03270174766692!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1szh-CN!2s!4v1587096003909!5m2!1szh-CN!2s"
        width="600" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false"
        tabindex="0"></iframe>
<a href="{% url 'index' %}">伪类选择器</a>
<br>
<a href="/static/images/bing.png"
   download="bing.png">
    This is a download link
</a>
<br>
<a href="mailto:3303705211@qq.com">mail to me:</a>3303705211@qq.com
<br>
<p>我们使用 <abbr title="超文本标记语言（Hypertext Markup Language）">HTML</abbr> 来组织网页文档。</p>

<p>第 33 届 <abbr title="夏季奥林匹克运动会">奥运会</abbr> 将于 2024 年 8 月在法国巴黎举行。</p>
<button>切换</button>
<br>
<object data="1910246.pdf" type="application/pdf"
        width="800" height="1200" typemustmatch>
    <p>You don't have a PDF plugin, but you can <a href="/static/1910246.pdf">download the PDF file.</a></p>
</object>
<br>
<br>


<script src="/static/js/demo1.js" defer></script>
</body>
</html>